<template>
    <scroll-view 
        :scroll-y="true"
        class="mz_charge_view">
        <view class="container">
            <view class="title el-after">
                未付费病人
            </view>
            <view class="three">
                <u-table>
                    <u-tr>
                        <u-th>挂号单</u-th>
                        <u-th>姓名</u-th>
                        <u-th>性别</u-th>
                        <u-th>科室</u-th>
                    </u-tr>
                    <u-tr 
                        v-for="(item,index) in patientList" 
                        :key="index"
                        @click.native="onClick(item)">
                        <u-td>{{item.rid}}</u-td>
                        <u-td>{{item.name}}</u-td>
                        <u-td>{{item.sex}}</u-td>
                        <u-td>{{item.sectionRoom}}</u-td>
                    </u-tr>
                </u-table>
            </view>
        </view>
    </scroll-view>
</template>

<script>
//门诊收费图
import {
    getNoPayUsers,
} from "@/common/api";
export default {
    data() {
        return {
            patientList:[],  //未付费病人数据
        }
    },
    onShow(){  //当页面可见时更新数据
        this.getNoPayUsers();
    },
    methods: {
        onClick(item){
            uni.navigateTo({
                url: '/pages/mz_charge/views/detail?rid='+item.rid,
            });
        },
        getNoPayUsers(){  //获取未付费病人
            getNoPayUsers(
                {
                    status:5,
                },
            ).then(data=>{
                this.patientList = data;
            }).catch(()=>{
                return;
            });
        },
    },
}
</script>
<style scoped lang="scss">
    .mz_charge_view{
        height: calc(100vh);
        .container{
            padding: 35rpx;
            box-sizing: border-box;
            .title{
                width: fit-content;
                font-size: 45rpx;
                color: #000000;
                font-weight: bold;
                margin-bottom: 35rpx;
            }
            >.three{
                .table_container{
                    max-height: 40vh;
                    overflow-y: scroll;
                }
            }
        }
    }
</style>
